import React, { Component } from 'react';

class Order extends Component {
  constructor() {
    super();
    this.state = {
      name: '',
      price: 1,
      num: 1
    }
  }
  add() {
    this.props.orderAction.addOrder({
      name: this.state.name,
      price: this.state.price,
      num: this.state.num
    })
  }
  render() {
    return (
      <div>
        <p>Order-子组件</p>
        {
          this.props.list.map((item, index)=> {
            return (
              <div key={index}>
                <p>名称：{item.name}</p>
                <p>价格：{item.price}</p>
                <p>数量{item.num}</p>
                <button onClick={()=>this.props.orderAction.delOrder(index)}>删除</button>
                <hr></hr>
              </div>
            )
          })
        }
        <p>新增订单：</p>
        <input type="text" value={this.state.name} onChange={(e)=>this.setState({name: e.target.value})} />
        <input type="text" value={this.state.price} onChange={(e)=>this.setState({price: e.target.value})} />
        <input type="text" value={this.state.num} onChange={(e)=>this.setState({num: e.target.value})} />
        <button onClick={()=>this.add()}>添加</button>
      </div>
    );
  }
}

export default Order;
